<template>
<div class="success-container">
    <div class="successHint">
        <img src="../../images/success.png" alt="">
         <div class="hint" >{{content}}</div>
    </div>
   
  </div>
</template>

<script>
export default {
    name:"successHint",
    components:{
    
    },
    props:{ 
    content:{
        type:String,
        required:true
        }

    },
 
   data(){
     return{
    
     }
      
   },
   watch: {  
    opacity(newValue, oldValue) {  
        this.opacity=newValue 
        }  
    }  
 }
</script>

<style lang="less">
.success-container{
        position: relative;
        width: 100%;
        .successHint{
            display: flex;
            align-items: center;
            justify-content: center;
            flex-direction: column;
            img{
                width: 1.44rem;
                height: 1.44rem;
                margin-bottom: .32rem;

            }
            .hint{
                font-size:.28rem;
                font-family:PingFangSC-Regular;
                font-weight:400;
                color:rgba(51,51,51,1);
            }
        }
     
   
}
    
  
</style>
